<template>
  <div>
    <x-card v-if="hasPerm('medicationregistration_page')">
      <div
        slot="content"
        class="table-page-search-wrapper"
      >
        <a-form layout="inline">
          <a-row :gutter="20">
            <a-col
              :md="7"
              :sm="24"
            >
              <a-form-item label="服药日期">
                <a-range-picker
                  v-model="queryParam.dates"
                />
              </a-form-item>
            </a-col>
            <a-col
              :md="5"
              :sm="24"
            >
              <a-form-item label="班级">
                <a-select
                  allowClear
                  v-model="queryParam.ClassId"
                  placeholder="请选择班级"
                >
                  <a-select-option
                    v-for="item in classList"
                    :key="item.id"
                    :value="item.id"
                  >{{
                    item.name
                  }}</a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col
              :md="7"
              :sm="24"
            >
              <a-button
                type="primary"
                @click="$refs.table.refresh(true)"
              >查询</a-button>
            </a-col>
          </a-row>
        </a-form>
      </div>
    </x-card>
    <a-card :bordered="false">
      <s-table
        ref="table"
        :columns="columns"
        :data="loadData"
        :rowKey="(record) => record.id"
      >
        <span
          slot="action"
          slot-scope="text, record"
        >
          <a
            type="danger"
            v-if="hasPerm('medicationregistration:check')"
            @click="$refs.checkDetail.check(record)"
          >查看</a>
          <a-divider
            type="vertical"
            v-if="hasPerm('medicationregistration:check') & hasPerm('medicationregistration:delete')"
          />
          <a-popconfirm
            v-if="hasPerm('medicationregistration:delete')"
            placement="topRight"
            title="确认删除？"
            @confirm="() => singleDelete(record)"
          >
            <a>删除</a>
          </a-popconfirm></span>
      </s-table>
    </a-card>
    <checkDetail ref="checkDetail" />
  </div>
</template>
  
  <script>
import { mRegisterList, mRegisterDelete } from '@/api/modular/garden/medicationregistration'
import { sysPosList } from '@/api/modular/garden/classManage'
import { STable, XCard, XDown } from '@/components'
import checkDetail from './checkDetail.vue'
import moment from 'moment'
export default {
  components: {
    XDown,
    XCard,
    STable,
    checkDetail,
  },
  data() {
    return {
      // 查询参数
      queryParam: {},
      // 表头
      columns: [
        {
          title: '姓名',
          dataIndex: 'childName',
        },
        {
          title: '服药时间',
          dataIndex: 'medicationTime',
        },
        {
          title: '班级',
          dataIndex: 'className',
        },
        {
          title: '服药说明',
          dataIndex: 'explain',
        },
        {
          title: '登记人',
          dataIndex: 'relationshipStr',
        },
        {
          title: '状态',
          dataIndex: 'stateStr',
        },
        {
          title: '操作',
          scopedSlots: { customRender: 'action' },
          width: '150px',
        },
      ],
      selectedRowKeys: [],
      selectedRows: [],
      classList: [],
      loadData: (parameter) => {
        return mRegisterList(Object.assign(parameter, this.switchingDate())).then((res) => {
          if (res.data.rows.length) {
            return res.data
          }
        })
      },
    }
  },
  created() {
    this.getClass()
  },
  methods: {
    getClass() {
      let obj = {
        isArchived: false,
      }
      sysPosList(obj).then((res) => {
        this.classList = res.data
      })
    },
    moment,
    /**
     * 查询参数组装
     */
    switchingDate() {
      const dates = this.queryParam.dates
      if (dates != null) {
        this.queryParam.StartTime = moment(dates[0]).format('YYYY-MM-DD')
        this.queryParam.EndTime = moment(dates[1]).format('YYYY-MM-DD')
        if (dates.length < 1) {
          delete this.queryParam.StartTime
          delete this.queryParam.EndTime
        }
      }
      const obj = JSON.parse(JSON.stringify(this.queryParam))
      delete obj.dates
      return obj
    },
    /**
     * 单个删除
     */
    singleDelete(record) {
      const param = [{ id: record.id }]
      this.mRegisterDelete(param)
    },
    /**
     * 删除
     */
    mRegisterDelete(param) {
      mRegisterDelete(param)
        .then((res) => {
          if (res.success) {
            this.$message.success('删除成功')
            this.$refs.table.clearRefreshSelected()
          } else {
            this.$message.error('删除失败：' + res.message)
          }
        })
        .catch((err) => {
          this.$message.error('删除错误：' + err.message)
        })
    },
    changeStatus(record) {
      console.log(record)
    },
    // handleOk() {
    //   this.$refs.table.refresh()
    // },
    onSelectChange(selectedRowKeys, selectedRows) {
      this.selectedRowKeys = selectedRowKeys
      this.selectedRows = selectedRows
    },
  },
}
</script>
  
  <style></style>
  